<template>
  <div class="container">
    <el-row type="flex" justify="space-between">
      <!-- 订单表单 -->
      <div class="main">
        <order-form :data="orderData" @usersChange="setLen" @getInsPrice="setInsPrice" />
      </div>

      <!-- 侧边栏 -->
      <div class="aside">
        <order-aside :data="orderData" :len="userLen" :insprice="insPrice" />
      </div>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'Order',
  data () {
    return {
      orderData: {},
      userLen: 1,
      insPrice: 0
    }
  },
  activated () {
    this.getOrderData()
  },
  methods: {
    getOrderData () {
      this.$axios.get('/airs/' + this.$route.query.id, {
        params: {
          seat_xid: this.$route.query.seat_xid
        }
      }).then((res) => {
        this.orderData = res.data
      })
    },
    setLen (len) {
      this.userLen = len
    },
    setInsPrice (price) {
      this.insPrice = price
    }
  }
}
</script>

<style scoped lang="less">
.container{
        width:1000px;
        margin:20px auto;
    }
    .aside{
        width: 350px;
        height: fit-content;
        border:1px #ddd solid;
    }
</style>
